<template>
  <view class="container" :style="appThemeStyle">
    <u-navbar
      :is-back="false"
      :background="{ backgroundColor: appTheme.mainBg }"
    >
      <view class="sub-list">
        <view
          class="sub-item"
          v-for="(item, index) in subList"
          :key="index"
          @click="onChangeSub(index)"
        >
          <text class="sub-text" :class="{ active: curSub === index }">{{ item.name }}</text>
          <u-badge :count="item.count" :offset="[-10, -28]" />
        </view>
      </view>
    </u-navbar>
    <view class="tabs-wrap">
      <view :class="['core', { active: getSubType === SUB_TABS_TYPE.PICK_AREA }]">
        <u-tabs
          bg-color="transparent"
          :list="tabs"
          :is-scroll="scrollTab"
          v-model="curTab"
          :duration="0.2"
          :offset="[10, getSubType === SUB_TABS_TYPE.PENDING_ORDER ? 4 : 0]"
          font-size="28"
          @change="onChangeTab"
          bar-width="0"
        />
      </view>
      <view class="controls" v-if="getSubType !== SUB_TABS_TYPE.PICK_AREA">
        <text class="iconfont icon-search" @click="handleSearch"></text>
        <text class="iconfont icon-setting"  @click="handleSetting"></text>
      </view>
    </view>
    <mescroll-body
      ref="mescrollRef"
      :sticky="true"
      @init="mescrollInit"
      :down="{ use: false }"
      :up="upOption"
      @up="upCallback"
    >
      <!--待处理 && 全部订单-->
      <order-list
        v-if="getSubType !== SUB_TABS_TYPE.PICK_AREA"
        :list="list"
        @controls="handleControls"
      />
      <!--拣货区-->
      <pick-list
        v-if="getSubType === SUB_TABS_TYPE.PICK_AREA"
        :list="list"
        :tabType="getTabType"
        :checkedIds="checkedIds"
        :orderCount="orderCount"
        :realityGoodsCount="realityGoodsCount"
        @pick-controls="handlePickControls"
        @check="handleCheckItem"
        @search="pickSearchForm"
      />
    </mescroll-body>
    <!-- 底部操作按钮 -->
    <view class="footer-fixed" v-if="getSubType === SUB_TABS_TYPE.PICK_AREA && getTabType === PICK_TABS_TYPE.PENDING_COUNT && list.length && pickerStatus">
      <view class="btn-wrapper">
        <u-checkbox
          :modelValue="checkedIds.length > 0 && checkedIds.length === list.length"
          shape="circle"
          :activeColor="appTheme.mainBg"
          @change="handleCheckAll"
        >全选</u-checkbox>
        <view class="total" v-if="orderTotal">
          已选 <text class="blue">{{ orderTotal }}</text> 个订单，共 <text class="blue">{{ goodsTotal }}</text> 件商品
        </view>
        <view class="action-wrap">
          <u-button
              type="primary"
              :custom-style="customStyle"
              @click="toPick([])"
          >去拣货</u-button>
        </view>
      </view>
    </view>

    <!--部分退限制退款提示-->
    <u-modal
      v-model="showPartModal"
      title="提示"
      :content="partModalText"
      confirm-text="我已知悉"
      :title-style="{
        fontWeight: 'bold'
      }"
      @confirm="showPartModal = false"
    >
    </u-modal>

    <!-- 消费返券确认弹窗 -->
    <RefundCoupon
      :list="refundCouponList"
      ref="refundCouponRef"
      @refundModal="refundModalConfirm"
    />

    <!-- 打印确定弹窗 -->
    <PrintPopup
      ref="printPopupRef"
      @confirm="confirmPrint"
    />

    <!--部分退提交弹窗-->
    <PartPopup
      ref="partPopupRef"
      :order="confirmOrder"
      @confirm="handlePartConfirm"
    />

    <!-- 骑手返货 -->
    <ReturnGoods :order="confirmOrder" ref="returnGoodsRef"/>

    <!-- 订单轨迹 -->
    <Tracks :list="tracks" ref="tracksRef"/>

    <!-- 指派拣货员 -->
    <PickerPopup :list="pickerList" ref="pickerPopupRef" @confirm="handlePickerConfirm"/>

    <!-- 复核弹窗 -->
    <PickReview
      :list="confirmOrder.goodsList"
      ref="pickReviewRef"
      @partReturn="handlePickPart"
      @confirm="$confirm(() => handleReviewConfirm(), {title: '操作提示', content: '是否确定已逐个核对商品拣货情况？'})"
    />

    <!-- 快速核验 -->
    <Scan v-if="getSubType === SUB_TABS_TYPE.PENDING_ORDER"/>

    <!-- 动态TabBar -->
    <TabBar/>
  </view>
</template>

<script>
import OrderList from './components/order-list.vue'
import PickList from './components/pick-list.vue'
import Scan from '@/components/scan'
import Tracks from './components/tracks.vue'
import RefundCoupon from './components/refund-coupon.vue'
import PartPopup from './components/part-popup.vue'
import ReturnGoods from './components/return-goods.vue'
import PrintPopup from './components/print-popup.vue'
import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins'
import { getEmptyPaginateObj, getMoreListData } from '@/core/app'
import OrderStatusEnum from "@/common/enum/order/orderStatus"
import RefundStatusEnum from "@/common/enum/order/refundStatus"
import PickOrderStatusEnum from '@/common/enum/order/pickOrderStatus'
import * as OrderApi from '@/api/order/order'
import * as PickApi from '@/api/order/pick'
import * as RefundApi from '@/api/order/refund'
import * as SettingApi from '@/api/setting'
import store from '@/store'
import { isEmpty, inArray, cloneObj } from "@/utils/util"
import OrderMixin from '@/core/mixins/order'
import storage from '@/utils/storage'
import { PICK_METHOD } from "@/store/mutation-types"
import StoreModel from '@/common/model/Store'
import TabBar from '@/components/tabbar'
import PickerPopup from './components/picker-popup.vue'
import PickReview from './components/pick-review.vue'
import PickModeEnum from '@/common/enum/setting/pickMode'
import PickerStatusEnum from "@/common/enum/setting/pickerStatus"
import SettingModal from '@/common/model/Setting'

// nav区域的枚举
const SUB_TABS_TYPE = {
  PENDING_ORDER: 'pendingOrder',
  PICK_AREA: 'pickArea',
  ALL_ORDER: 'allOrder'
}

// 待处理订单的枚举
const ORDER_TABS_TYPE = {
  NEW_ORDER_COUNT: 'newOrderCount',
  WAIT_PREPARE_COUNT: 'waitPrepareCount',
  WAIT_DELIVERY_COUNT: 'waitDeliveryCount',
  DELIVERING_COUNT: 'deliveringCount',
  ABNORMAL_COUNT: 'abnormalCount',
  REFUND_ORDER_COUNT: 'refundOrderCount',
}

// 拣货区的type枚举
const PICK_TABS_TYPE = {
  ASSIGN_COUNT: 'assignCount',
  TURN_COUNT: 'turnCount',
  UNAPPROPRIATED_COUNT: 'unappropriatedCount',
  PENDING_COUNT: 'pendingCount',
  PICKING_COUNT: 'pickingCount',
  RECHECK_COUNT: 'reviewCount',
  COMPLETE_COUNT: 'completeCount',
}

// 全部订单的枚举
const OTHER_TABS_TYPE = {
  ALL: 'all',
  COMPLETE: 'complete',
  CANCEL: 'cancel'
}

const navList = [
  { name: '待处理', count: 0, type: SUB_TABS_TYPE.PENDING_ORDER },
  { name: '拣货区', count: 0, type: SUB_TABS_TYPE.PICK_AREA },
  { name: '全部订单', count: 0, type: SUB_TABS_TYPE.ALL_ORDER }
]

const orderTabs =  [
  { name: '新订单', value: `${OrderStatusEnum.NEW.value}`, count: 0, type: ORDER_TABS_TYPE.NEW_ORDER_COUNT },
  { name: '待备货', value: `${OrderStatusEnum.RECEIVES.value}, ${OrderStatusEnum.REVIEWED.value}`, count: 0, type: ORDER_TABS_TYPE.WAIT_PREPARE_COUNT  },
  { name: '待配送', value: `${OrderStatusEnum.STOCK_UP.value}, ${OrderStatusEnum.WAIT_PICK_UP.value}`, count: 0, type: ORDER_TABS_TYPE.WAIT_DELIVERY_COUNT },
  { name: '配送中', value: `${OrderStatusEnum.DELIVERING.value}`, count: 0, type: ORDER_TABS_TYPE.DELIVERING_COUNT },
  { name: '异常单', value: `${OrderStatusEnum.DELIVERY_ABNORMAL.value}, ${OrderStatusEnum.DELIVERY_CANCEL.value}, ${OrderStatusEnum.APPLY_CANCEL.value}`, count: 0, type: ORDER_TABS_TYPE.ABNORMAL_COUNT },
  { name: '售后单', value: `${RefundStatusEnum.NEW.value}, ${RefundStatusEnum.PROCESSING.value}, ${RefundStatusEnum.CUSTOMER_EXAMINE.value},
   ${RefundStatusEnum.WAIT_RETURNED.value}, ${RefundStatusEnum.REFUNDING.value}, ${RefundStatusEnum.RETURNING.value}`, count: 0, type: ORDER_TABS_TYPE.REFUND_ORDER_COUNT }
]

const pickTabs = [
  { name: '待指派', value: PickOrderStatusEnum.WAIT_DISTRIBUTION.value, count: 0, type: PICK_TABS_TYPE.ASSIGN_COUNT },
  { name: '待转派', value: PickOrderStatusEnum.WAIT_TURN.value, count: 0, type: PICK_TABS_TYPE.TURN_COUNT },
  { name: '待抢单', value: PickOrderStatusEnum.WAIT_ROB.value, count: 0, type: PICK_TABS_TYPE.UNAPPROPRIATED_COUNT },
  { name: '待拣货', value: PickOrderStatusEnum.WAIT_PICKING.value, count: 0, type: PICK_TABS_TYPE.PENDING_COUNT },
  { name: '拣货中', value: PickOrderStatusEnum.PICKING.value, count: 0, type: PICK_TABS_TYPE.PICKING_COUNT },
  { name: '待复核', value: PickOrderStatusEnum.WAIT_REVIEW.value, count: 0, type: PICK_TABS_TYPE.RECHECK_COUNT },
  { name: '已拣货', value: PickOrderStatusEnum.PICKING_COMPLETE.value, count: 0, type: PICK_TABS_TYPE.COMPLETE_COUNT }
]

const otherOrderTabs = [
  { name: '全部', value: '', type: OTHER_TABS_TYPE.ALL },
  { name: '已完成', value: `${OrderStatusEnum.COMPLETED.value}`, type: OTHER_TABS_TYPE.COMPLETE },
  { name: '已取消', value: `${OrderStatusEnum.CANCELLED.value}`, type: OTHER_TABS_TYPE.CANCEL }
]

export default {
  name: "index",
  mixins: [MescrollMixin, OrderMixin],
  components: {
    TabBar,
    PickList,
    OrderList,
    Scan,
    Tracks,
    RefundCoupon,
    PartPopup,
    ReturnGoods,
    PrintPopup,
    PickerPopup,
    PickReview
  },
  data() {
    return {
      SUB_TABS_TYPE,
      ORDER_TABS_TYPE,
      PICK_TABS_TYPE,
      OTHER_TABS_TYPE,
      inArray,
      customStyle: {
        height: '64rpx',
        padding: '12rpx 24rpx'
      },
      OrderStatusEnum,
      PickerStatusEnum,
      PickModeEnum,
      curSub: 0,
      subList: navList,
      curTab: 0,
      tabs: orderTabs,
      showSearch: false,
      list: getEmptyPaginateObj(),
      orderCount: 0,
      realityGoodsCount: 0,
      queryParams: {},
      pickParams: {},
      // 上拉加载配置
      upOption: {
        // 首次自动执行
        auto: true,
        // 每页数据的数量; 默认10
        page: { size: 10 },
        // 数量要大于3条才显示无更多数据
        noMoreSize: 3,
        empty: {
          icon: this.$image('/storeminiapp/empty-order.png'),
          tip: '这里空空如也~'
        }
      },
      checkedIds: [],
      // 控制onShow事件是否刷新列表
      canReset: false,
      // 拣货员信息
      pickerList: [],
    }
  },
  computed: {
    getSubType() {
      return this.subList[this.curSub]?.type
    },
    getTabType() {
      return this.tabs[this.curTab].type
    },
    // 获取当前标签项的值
    getTabValue() {
      return this.tabs[this.curTab].value
    },
    fetchList() {
      switch (this.getSubType) {
        case SUB_TABS_TYPE.PENDING_ORDER : return this.getTabType === ORDER_TABS_TYPE.REFUND_ORDER_COUNT ? RefundApi.getRefundList : OrderApi.getPendingList
        case SUB_TABS_TYPE.PICK_AREA : return PickApi.getPickList
        case SUB_TABS_TYPE.ALL_ORDER : return OrderApi.getOrderList
      }
    },
    scrollTab() {
      return this.tabs.length > 5
    },
    store() {
      return store.getters.store
    },
    counter() {
      return store.getters.counter
    },
    businessType() {
      return store.getters.businessType
    },
    pickConfig() {
      return store.getters.pickConfig
    },
    pickOrders() {
      return store.getters.pickOrders
    },
    pickerStatus() {
      return store.getters.pickerStatus
    },
    orderTotal() {
      return this.list.filter(item => this.checkedIds.includes(item.pickOrderId)).length
    },
    goodsTotal() {
      const selectedList = this.list.filter(item => this.checkedIds.includes(item.pickOrderId))
      return selectedList.reduce((pre, cur) => pre + cur.goodsCount, 0)
    }
  },
  onLoad() {
    // 注册全局事件订阅: 是否刷新列表
    uni.$on('syncRefresh', canReset => {
      this.canReset = canReset
    })
    this.setOrderParams()
  },
  onUnload() {
    // 卸载全局事件订阅
    uni.$off('syncRefresh')
  },
  onShow() {
    this.getTabCount()
    this.getPickConfig()
    if (this.canReset) {
      this.onRefreshList()
      this.canReset = false
    }
    uni.hideTabBar()
  },
  onReady() {
    if (this.pickerStatus === PickerStatusEnum.REST.value) {
      this.$confirm(
        () => SettingModal.setPickUser(PickerStatusEnum.LEISURE.value),
        {title: '拣货员', content: '当前是休息状态，您是否确定切换为“在线”？'}
      )
    }
  },
  methods: {
    async getPickConfig() {
      const { data: config } = await SettingApi.getShopsPickConfig(this.store.id)
      config.pickMethod = storage.get(PICK_METHOD) || 0
      store.commit('SET_PICK_CONFIG', config)
      this.subList = cloneObj(navList)
      // 当拣货助手不起用时，需过滤拣货区
      if (config.pickMode === PickModeEnum.OFF.value || this.businessType === 0) {
        this.subList = this.subList.filter(item => item.type !== SUB_TABS_TYPE.PICK_AREA)
      }
    },
    /**
     * 上拉加载的回调 (页面初始化时也会执行一次)
     * 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10
     * @param {Object} page
     */
    upCallback(page) {
      this.getList(page.num)
        .then(res => {
          const curPageLen = res.length
          this.mescroll.endBySize(curPageLen)
        })
        .catch(() => this.mescroll.endErr())
    },
    /**
     * 组装请求参数
     */
    buildParams(type) {
      return type === SUB_TABS_TYPE.PICK_AREA ? this.pickParams : this.queryParams
    },
    setOrderParams() {
      delete this.queryParams.orderStatusList
      delete this.queryParams.refundStatusList
      delete this.pickParams.status
      delete this.pickParams.withDetail
      delete this.pickParams.startDate
      delete this.pickParams.endDate
      delete this.queryParams.organizationIds
      if (this.businessType !== 0) this.queryParams.organizationIds = !isEmpty(this.counter) ? this.counter.storeId : this.store.id
      const str = this.getSubType === SUB_TABS_TYPE.PENDING_ORDER && this.getTabType === ORDER_TABS_TYPE.REFUND_ORDER_COUNT ? 'refundStatusList' : 'orderStatusList'
      this.queryParams[str] = this.getTabValue
      this.pickParams.pickType = this.pickConfig.pickType || 1
      if (this.getSubType === SUB_TABS_TYPE.PICK_AREA) {
        this.pickParams.status = this.getTabValue
        if (this.getTabValue === PickOrderStatusEnum.WAIT_PICKING.value || this.getTabValue === PickOrderStatusEnum.PICKING.value) {
          this.pickParams.withDetail = true
        }
        if (this.getTabValue === PickOrderStatusEnum.PICKING_COMPLETE.value) {
          this.pickParams.startDate = this.$moment().format("YYYY-MM-DD 00:00:00")
          this.pickParams.endDate = this.$moment().format("YYYY-MM-DD 23:59:59")
          this.getPickCount()
        }
      }
    },
    /**
     * 获取订单列表
     * @param {Number} current 页码
     */
    getList(current = 1) {
      return new Promise((resolve, reject) => {
        this.fetchList({ ...this.buildParams(this.getSubType),  current }, { load: false })
          .then(result => {
            const newList = result.data
            this.list = getMoreListData(newList, this.list, current)
            resolve(newList)
          })
          .catch(reject)
      })
    },
    // 当前拣货员已完成拣货单汇总
    getPickCount() {
      const { startDate, endDate } = this.pickParams
      PickApi.getPickCount({
        startDate,
        endDate
      }, { load: false }).then(({data}) => {
        if (data) {
          this.orderCount = data.orderCount
          this.realityGoodsCount = data.realityGoodsCount
        }
      }).catch(() => {})
    },
    /**
     * 获取订单/拣货单数量
     */
    getTabCount() {
      OrderApi.getTabPop(this.buildParams(SUB_TABS_TYPE.PENDING_ORDER)).then(result => {
        const { data } = result
        if (data) {
          this.subList.forEach(item => {
            if (item.type === SUB_TABS_TYPE.PENDING_ORDER) {
              item.count = data.totalCount || 0
            }
          })
          if (this.getSubType === SUB_TABS_TYPE.PENDING_ORDER) {
            this.tabs.forEach(item => {
              item.count = data[item.type] || 0
            })
          }
        }
      }).catch(() => {})
      PickApi.getTabPop(this.buildParams(SUB_TABS_TYPE.PICK_AREA)).then(result => {
        const { data } = result
        if (data) {
          this.subList.forEach(item => {
            if (item.type === SUB_TABS_TYPE.PICK_AREA) {
              item.count = data.totalCount || 0
            }
          })
          if (this.getSubType === SUB_TABS_TYPE.PICK_AREA) {
            this.tabs.forEach(item => {
              item.count = data[item.type] || 0
            })
          }
        }
      }).catch(() => {})
    },
    onChangeSub(index) {
      this.curSub = index
      this.curTab = 0
      const { pickMode, isReview } = this.pickConfig
      let pTabs = cloneObj(pickTabs)
      // 复核开关未开启，过滤待复核tab栏
      if (!isReview) pTabs = pTabs.filter(item => ![PICK_TABS_TYPE.RECHECK_COUNT].includes(item.type))
      // 派单模式过滤待抢单，抢单模式过滤待指派&&待转派
      const dTabs = pickMode === PickModeEnum.SEND.value ? pTabs.filter(item => ![PICK_TABS_TYPE.UNAPPROPRIATED_COUNT].includes(item.type)) :
        pickMode === PickModeEnum.ROB.value ? pTabs.filter(item => ![PICK_TABS_TYPE.ASSIGN_COUNT, PICK_TABS_TYPE.TURN_COUNT].includes(item.type)) : pickTabs
      this.tabs = this.getSubType === SUB_TABS_TYPE.PICK_AREA ? dTabs : this.getSubType === SUB_TABS_TYPE.ALL_ORDER ? otherOrderTabs : orderTabs
      this.setOrderParams()
      this.onRefreshList()
      if (this.pickerStatus === PickerStatusEnum.REST.value && this.getSubType === SUB_TABS_TYPE.PICK_AREA) {
        this.$confirm(
          () => SettingModal.setPickUser(PickerStatusEnum.LEISURE.value),
          {title: '拣货员', content: '当前是休息状态，您是否确定切换为“在线”？'}
        )
      }
    },
    onChangeTab(index) {
      this.curTab = index
      this.setOrderParams()
      this.onRefreshList()
    },
    // 刷新列表
    onRefreshList() {
      this.getTabCount()
      this.list = getEmptyPaginateObj()
      setTimeout(() => this.mescroll.resetUpScroll(), 120)
    },
    handleSearch() {
      this.$navTo('pages/order/search')
    },
    handleSetting() {
      this.$navTo('orderpages/setting/index')
    },
    handlePickControls(type, payload) {
      switch (type) {
        case 'preempt' : return this.preempt(payload)
        case 'picking' : return this.toPick(payload)
        case 'picker' : return this.picker(payload)
        case 'recheck' : return this.recheck(payload)
      }
    },
    // 抢单
    preempt(payload) {
      PickApi.preempt([payload.pickOrderId]).then(res => {
        if (res.data) {
          this.$toast('抢单成功')
          this.onRefreshList()
          StoreModel.logs({
            status: 1,
            businessId: payload.channelOrderNo,
            operationType: 'pick_order_receive'
          })
        }
      }).catch(() => {
        StoreModel.logs({
          status: 0,
          businessId: payload.channelOrderNo,
          operationType: 'pick_order_receive'
        })
      })
    },
    // 跳转至拣货页面
    toPick(list) {
      const page = (list) => {
        if (this.pickOrders?.length) {
          // 当前选中集合
          const currentIds = list.map(val => val.pickOrderId)
          // 取出缓存的list,并处理掉退单的订单
          const cacheIds = this.pickOrders.map(item => item.pickOrderId).filter(val => currentIds.includes(val))
          // 计算新增的值
          const diffIds = currentIds.filter(item => !cacheIds.includes(item))
          const currentList = this.pickOrders.filter(val => currentIds.includes(val.pickOrderId))
          const diffList = list.filter(val => diffIds.includes(val.pickOrderId))
          const result = cloneObj([...currentList, ...diffList])
          // 缓存里面的quantity被webSocket修改过值，这里重新进入需要以接口返回的quantity为准
          result.forEach(objA => {
            const objB = list.find(item => item.pickOrderId === objA.pickOrderId)
            if(objB) {
              objA.goodsList.forEach(itemA => {
                const itemB = objB.goodsList.find(item => item.pickOrderGoodsId === itemA.pickOrderGoodsId)
                if (itemB) {
                  itemA.quantity = itemB.quantity
                  itemA.selectedQuantity = itemA.selectedQuantity ? itemB.quantity : 0
                  itemA.refundQuantity = 0
                }
              })
            }
          })
          store.commit('SET_PICK_ORDERS', result)
        } else {
          store.commit('SET_PICK_ORDERS', list)
        }
        this.$navTo('orderpages/pick/index')
      }
      if (list.length) return page(list)
      if (!this.checkedIds.length) return this.$toast('请选择拣货单！')
      PickApi.start(this.checkedIds).then(({ data }) => {
        if (data) {
          const picks = this.list.filter(item => this.checkedIds.includes(item.pickOrderId))
          page(picks)
          setTimeout(() => {
            this.checkedIds = []
            this.onRefreshList()
            StoreModel.logs({
              status: 1,
              operationType: 'pick_start'
            })
          }, 1000)
        }
      }).catch(() => {
        StoreModel.logs({
          status: 0,
          operationType: 'pick_start'
        })
      })
    },
    // 拣货员信息
    picker(payload) {
      this.confirmOrder = payload
      PickApi.getPickUserList().then(res => {
        if (res.data) {
          this.pickerList = res.data
          this.$refs.pickerPopupRef.show()
        }
      })
    },
    // 拣货单手动派单
    handlePickerConfirm(picker) {
      const { pickOrderId } = this.confirmOrder
      const { pickerId } = picker
      PickApi.allocate({
        pickOrderId,
        pickerId
      }).then(res => {
        if (res.data) {
          this.$toast('操作成功')
          this.$refs.pickerPopupRef.hide()
          this.onRefreshList()
        }
      })
    },
    // 复核列表
    recheck(payload) {
      this.confirmOrder = payload
      PickApi.detail({
        pickOrderId: payload.pickOrderId,
        pickType: this.pickConfig.pickType
      }).then(({ data }) => {
        if (data) {
          this.confirmOrder.goodsList = data
          this.$refs.pickReviewRef.show()
        }
      }).catch(() => {})
    },
    handlePickPart() {
      this.handlePartReturn(this.confirmOrder)
    },
    // 确认复核
    handleReviewConfirm() {
      const { pickOrderId, thirdChannelId, channelOrderNo, goodsList } = this.confirmOrder
      const nGoodsList = goodsList.map(item => {
        return {
          pickOrderGoodsId: item.pickOrderGoodsId,
          quantity: item.quantity
        }
      })
      PickApi.review({
        pickOrderId,
        thirdChannelId,
        channelOrderNo,
        goodsList: nGoodsList
      }).then(res => {
        if (res.data) {
          this.$toast('操作成功')
          this.$refs.pickReviewRef.hide()
          this.onRefreshList()
        }
      })
    },
    handleCheckItem(pickOrderId) {
      const { checkedIds } = this
      const index = checkedIds.findIndex(id => id === pickOrderId)
      index < 0 ? checkedIds.push(pickOrderId) : checkedIds.splice(index, 1)
    },
    // 全选事件
    handleCheckAll() {
      const { checkedIds, list } = this
      this.checkedIds = checkedIds.length === list.length ? [] : list.map(item => item.pickOrderId)
    },
    pickSearchForm(values) {
      this.pickParams = { ...this.pickParams, ...values }
      this.getPickCount()
      this.onRefreshList()
    }
  }
}
</script>

<style scoped lang="scss">
.container {
  padding: 0 24rpx 24rpx;

  .sub-list {
    display: flex;
    align-items: center;
    margin-left: 60rpx;

    .sub-item {
      color: #ffffff;
      position: relative;
      margin: 0 24rpx;

      .sub-text {
        font-size: 28rpx;
        font-weight: 400;
        opacity: 0.6;
      }
      .active {
        font-size: 34rpx;
        font-weight: 500;
        opacity: 1
      }
    }
  }

  .tabs-wrap {
    display: flex;
    justify-content: space-between;
    align-items: stretch;

    .core {
      width: 85%;

      &.active {
        flex: 1;
      }
    }

    .controls {
      display: flex;
      justify-content: center;
      font-size: 30rpx;
      align-items: center;
      box-shadow: -12rpx 0 10rpx -10rpx #cccccc;

      .icon-search, .icon-setting {
        padding: 16rpx;
      }
    }
  }

  // 底部操作栏
  .footer-fixed {
    position: fixed;
    bottom: 108rpx;
    left: 0;
    right: 0;
    z-index: 11;
    background: #fff;
	  width: 100%;
    border-top: 2rpx solid #eee;

    // 设置ios刘海屏底部横线安全区域
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);

    .btn-wrapper {
      padding: 16rpx 32rpx;
      display: flex;
      align-items: center;

      .total {
        font-size: 24rpx;
        color: #000000;
        padding-right: 12rpx;

        .blue {
          color: #2D71FD;
        }
      }

      .action-wrap {
        margin-left: auto;
        flex-shrink: 0;
      }
    }
  }

  /* 隐藏滚动条 */
  ::-webkit-scrollbar {
    width: 0;
    height: 0;
    color: transparent;
  }
}
</style>
